<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        		//then方法
		//then方法的第一个参数是resolve回调函数(成功返回的数据),reject是第二个
//		参数(可选),失败的状态.
//		then()返回一个新的promise实例,可以采用链式编程(想想JQ方法)
//      resolve() reject()  all()  race()  done() finally()
		
		// 1.resolve()可以把任何的对象转化成promise对象
        // let pm = Promise.resolve("哈哈");
        // console.log(pm);
        // pm.then(res=>{
        //     console.log(res);
        // })
        
        // let pm = new Promise(function(resolve,reject){
        //         resolve("6666")
        // })
        // pm.then(function(res){
        //     console.log(res);
        // })
        // 作业：自己转化

        // 2.reject() 和 resolve()相似
        
        // let pm = Promise.reject("失败了")
        //     pm.then(err=>{
        //         console.log(err);
        //     })

        // 3.all()可能在做一些游戏类加载资源使用一步操作
		// 哈哈，看一下伪代码吧，脑补一下场景
		// let promise1 = new Promise((resolve,reject)=>{ })//比如加载图片
		// let promise2 = new Promise((resolve,reject)=>{ })//比如加载静态资源
		// let promise1 = new Promise((resolve,reject)=>{ })//比如加载flash的
			
		// let p4 = Promise.all([promise1,promise2,promise3]); 
		// p4.then(()=>{
		// 	//三个都成功   才成功
		// }).catch(err=>{
		// 	//如果有一个失败就失败了
		// })

        // 客串
        // var pm = new Promise((resolve,reject)=>{
        //     if(true){
        //         resolve(666)
        //     }else{
        //         reject("失败")
        //     }
        // })
        // pm.then((res)=>{
        //     console.log(res);
        // }).catch(err=>{
        //     console.log(err);
        // })
        // pm.then((res)=>{
        //     console.log(res);
        // },(err)=>{
        //     console.log(err);
        // })

        // 4 race() 表示某个异步请求设置超时时间，并且在超时后执行相应的操作
		// 1 请求图片资源
			function requestImg(imgSrc){
				return new Promise((resolve,reject)=>{
					const img = new Image();
					img.onload = function(){
						resolve(img)
					}
					img.src = imgSrc;
				})
			}

			function timeout(){
				return new Promise((resolve,reject)=>{
					setTimeout(()=>{
						// reject("图片请求失败")
						reject(new Error("图片请求失败"))
					},3000)
				})
			}

			Promise.race([requestImg('http://www.zhangli6.top/assets/img/service-3.png'),timeout()]).then(res=>{
				console.log(res);
				document.body.appendChild(res);
			}).catch(err=>{
				console.log(err)
			})

			// 5. done() finally()在最后面写目前用的比较少，服务端会用到，先不说了
    </script>
</body>
</html>